<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
	xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
	layout:decorator="home">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="Dashboard">
    <meta name="keyword" content="Dashboard, Bootstrap, Admin, Template, Theme, Responsive, Fluid, Retina">

    <title th:text="${application.get('projectName')}"></title>
    <link rel="shortcut icon" th:href="@{/global/myicon.ico}">

    <!-- Bootstrap core CSS -->
    <link th:href="@{/global/assets/css/bootstrap.css}" rel="stylesheet">
    <!--external css-->
    <link th:href="@{/global/assets/font-awesome/css/font-awesome.css}" rel="stylesheet" />
    <link rel="stylesheet" type="text/css" th:href="@{/global/assets/css/zabuto_calendar.css}">
    <link rel="stylesheet" type="text/css" th:href="@{/global/assets/js/gritter/css/jquery.gritter.css}" />
    <link rel="stylesheet" type="text/css" th:href="@{/global/assets/lineicons/style.css}">    
    
    <!-- Custom styles for this template -->
    <link th:href="@{/global/assets/css/style.css}" rel="stylesheet">
    <link th:href="@{/global/assets/css/style-responsive.css}" rel="stylesheet">

    <script src="/global/assets/js/chart-master/Chart.js"></script>
    
    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>

  <body>

  <section id="container" >
      <!-- **********************************************************************************************************************************************************
      TOP BAR CONTENT & NOTIFICATIONS
      *********************************************************************************************************************************************************** -->
      <!--header start-->
      <header class="header black-bg">
              <div class="sidebar-toggle-box">
                  <div class="fa fa-bars tooltips" data-placement="right" data-original-title="切换导航"></div>
              </div>
            <!--logo start-->
            <a th:href="@{/}" class="logo"><b th:text="${application.get('projectName')}+后台"></b></a>
            <!--logo end-->
            <div class="top-menu">
            <form th:action="@{/logout}" method="post">
            	<ul class="nav pull-right top-menu">
                    <li><button class="logout">注销</button></li>
            	</ul>
            	</form>
            </div>
        </header>
      <!--header end-->
      
      <!-- **********************************************************************************************************************************************************
      MAIN SIDEBAR MENU
      *********************************************************************************************************************************************************** -->
      <!--sidebar start-->
      <aside th:fragment="leftMenu">
          <div id="sidebar"  class="nav-collapse ">
              <!-- sidebar menu start-->
              <ul class="sidebar-menu" id="nav-accordion">
              
              	  <p class="centered"><a href="profile.html"><img th:src="${session.user.headIMG}" class="img-circle" width="60"></a></p>
              	  <h5 class="centered" th:text ="${session.user.nickName}"></h5>
              	 <li class="mt">
                      <a th:class="${page==null}?'active':''" th:href="@{/}">
                          <i class="fa fa-dashboard"></i>
                          <span>仪表盘</span>
                      </a>
                  </li>
              	<tr th:each="menu : ${session.menu}">
 					<li th:if="${menu.fid==0}" class="sub-menu">
 						<a href="javascript:;" th:class="${menu.id==pageid}?'active':''" >
                          <i th:class="${menu.menuFa}"></i>
                          <span th:text="${menu.menuName}"></span>
                      	</a>
                      	<ul th:each="menuson : ${session.menuSon}" class="sub">
                          	<li th:if="${menu.id==menuson.fid}" th:class="${page==menuson.menuPath}?'active':''">
                          		<a  th:href="${menuson.menuPath}"><span th:text="${menuson.menuName}"></span></a>
                          	</li>
                      	</ul>
    				</li> 
				</tr>	
              </ul>
              <!-- sidebar menu end-->
          </div>
      </aside>
 
   
  </section>

    <!-- js placed at the end of the document so the pages load faster -->
    <script src="/global/assets/js/jquery.js"></script>
    <script src="/global/assets/js/jquery-1.8.3.min.js"></script>
    <script src="/global/assets/js/bootstrap.min.js"></script>
    <script class="include" type="text/javascript" src="/global/assets/js/jquery.dcjqaccordion.2.7.js"></script>
    <script src="/global/assets/js/jquery.scrollTo.min.js"></script>
    <script src="/global/assets/js/jquery.nicescroll.js" type="text/javascript"></script>
    <script src="/global/assets/js/jquery.sparkline.js"></script>


    <!--common script for all pages-->
    <script src="/global/assets/js/common-scripts.js"></script>
    
    <script type="text/javascript" src="/global/assets/js/gritter/js/jquery.gritter.js"></script>
    <script type="text/javascript" src="/global/assets/js/gritter-conf.js"></script>

    <!--script for this page-->
    <script src="/global/assets/js/sparkline-chart.js"></script>    
	<script src="/global/assets/js/zabuto_calendar.js"></script>	
	
	
	<script type="application/javascript">
        $(document).ready(function () {
            $("#date-popover").popover({html: true, trigger: "manual"});
            $("#date-popover").hide();
            $("#date-popover").click(function (e) {
                $(this).hide();
            });
        
            $("#my-calendar").zabuto_calendar({
                action: function () {
                    return myDateFunction(this.id, false);
                },
                action_nav: function () {
                    return myNavFunction(this.id);
                },
                ajax: {
                    url: "show_data.php?action=1",
                    modal: true
                },
                legend: [
                    {type: "text", label: "Special event", badge: "00"},
                    {type: "block", label: "Regular event", }
                ]
            });
        });
        
        
        function myNavFunction(id) {
            $("#date-popover").hide();
            var nav = $("#" + id).data("navigation");
            var to = $("#" + id).data("to");
            console.log('nav ' + nav + ' to: ' + to.month + '/' + to.year);
        }
    </script>
  

  </body>
</html>
